import 'package:flutter/material.dart';
import 'model/GradeModel.dart';

Widget GradeWidget(BuildContext context,List<Grade> items) {
  return new Column(
    crossAxisAlignment: CrossAxisAlignment.center,
    children: <Widget>[
      //答题卡
      new Container(
        color: Color.fromRGBO(242, 242, 242, 1),
        padding: EdgeInsets.only(left: 15, right: 20),
        height: 50,
        child:_getGradeTitle(),//打分标题行
      ),
      _getCardListWidget(context,items)//打分每题卡片
    ],
  );
}

//打分 标题栏==========================
Widget _getGradeTitle() {
return new Row(
  children: <Widget>[
    new Expanded(
      child: Text('答题卡', style: TextStyle(color: Colors.black87, fontSize: 16)),
      flex: 1,
    ),
    new Expanded(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          _getColorCircle(Color.fromRGBO(61, 192, 119, 1), 16, 16, EdgeInsets.only(right: 10, left: 10)),
          Text('答对', style: TextStyle(color: Colors.black54, fontSize: 13)),
          _getColorCircle(Color.fromRGBO(234, 79, 93, 1), 16, 16, EdgeInsets.only(right: 10, left: 10)),
          Text('答错', style: TextStyle(color: Colors.black54, fontSize: 13)),
        ],
      ),
      flex: 1,
    ),
  ],
);
}

//获取小圆圈==========================
Widget _getColorCircle(Color color, double width, double height, EdgeInsets margin) {
  return new Container(
    width: width,
    height: height,
    margin: margin,
    decoration: new BoxDecoration(
      shape: BoxShape.circle,
      color: color,
    ),
    alignment: Alignment.center,
  );
}
//获取答题卡(all)==========================
Widget _getCardListWidget(BuildContext context,List<Grade> items) {
  return ListView.builder(
      shrinkWrap: true,
      physics: new NeverScrollableScrollPhysics(),
      itemCount: items.length,
      itemBuilder: (BuildContext context, int position) {
        var cell = _getCardGridWidget(context,items[position].title, items[position].items);
        return cell;
      });
}
//获取每1大题的答题卡==========================
Widget _getCardGridWidget(BuildContext context, String title,List<GradeItem>  items) {
  int padding = 15;

  var titleView = new Container(
    height: 60,
    padding: EdgeInsets.only(
      top: 15,
    ),
    child: Text(title, style: TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.w500)),
  );

  var container = Container(
//      color: Colors.blueGrey,
      alignment: Alignment.center,
      margin: EdgeInsets.only(left: padding.toDouble() * 1.5, right: padding.toDouble() * 1.5),
      child: GridView.count(
          physics: new NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          childAspectRatio: 1.5,
          crossAxisCount: 5,
          //横向Item的个数
          crossAxisSpacing: padding.toDouble(),
          //横向间距
          mainAxisSpacing: padding.toDouble(),
          //竖向间距
          children: _buildGridTileList(items, context)));

  var column = Column(
    children: <Widget>[
      titleView,
      container,
    ],
  );

  return column;
}
////获取某一大题答题卡的GradView==========================
List<Widget> _buildGridTileList(List<GradeItem> items, BuildContext context) {
  List<Widget> widgetList = new List();
  for (int i = 0; i < items.length; i++) {
    widgetList.add(_getItemWidget(i, items[i].isRight));
  }
  return widgetList;
}
////获取答题卡的最小单元(圆圈+数字)==========================
Widget _getItemWidget(int index, bool isok) {
  return new Container(
    //BoxFit 可设置展示图片时 的填充方式
    decoration: new BoxDecoration(
      shape: BoxShape.circle,
      color: isok ? Color.fromRGBO(61, 192, 119, 1) : Color.fromRGBO(234, 79, 93, 1),
    ),
    alignment: Alignment.center,
    child: new Text(
      (index + 1).toString(),
      style: TextStyle(
        fontSize: 12,
        color: Colors.white,
      ),
    ),
  );
}

